﻿<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
    <head th:replace="common/adminAll :: head(~{::title})">
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
        <title>订单详情</title>
    </head>

    <body>
        <!--头部信息栏部分  begin-->
        <header th:replace="common/adminAll::header"></header>
        <!--头部信息栏部分 end-->

        <!--页面主题部分开始-->
        <section>
            <div class="mainwrapper">
                <!--侧变导航栏部分  begin-->
                <div th:replace="common/adminAll::leftMain(2)"></div>
                <!--侧变导航栏部分 end-->


                <!--左边主题显示部分开始-->
                <div class="mainpanel">
                    <div class="contentpanel">

                        <div class="row">
                            <div class="col-md-12">
                                <h3 class="inline-block">订单管理</h3>
                                <h5 class="inline-block ml10">订单详情</h5>
                                <form  action="" class="form-horizontal form-bordered">
                                    <div class="panel panel-default">
                                        <div class="panel-heading">
                                            <h4 class="panel-title">订单信息</h4>
                                        </div><!-- panel-heading -->
                                        <div class="panel-body">
                                            <div class="row">
                                                <div class="form-group">
                                                    <label class="col-md-1 control-label">订单编号</label>
                                                    <div class="col-md-5">
                                                        <input type="text" th:value="${order.orderNum}" name="isbn" class="form-control" readonly />
                                                    </div>

                                                    <label class="col-md-1 control-label">下单时间</label>
                                                    <div class="col-md-5">
                                                        <div class="input-group mb15">
                                                            <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
                                                            <input type="text" th:value="${#dates.format(order.createDate,'yyyy年MM月dd日 HH:mm:ss')}" class="form-control" value="2021-12-18 16:20:33" readonly />
                                                        </div>
                                                    </div>
                                                </div><!-- form-group -->

                                                <div class="form-group">
                                                    <label class="col-md-1 control-label">订单状态</label>
                                                    <div class="col-md-5">
                                                        <div class="mt10">
                                                            <span th:switch="${order.orderStatus}">
                                                                <span th:case="1" class="label label-danger">未付款</span>
                                                                <span th:case="2" class="label label-info">已付款</span>
                                                                <span th:case="3" class="label label-success">交易成功</span>
                                                            </span>
                                                        </div>
                                                    </div>

                                                    <label class="col-md-1 control-label">发货状态</label>
                                                    <div class="col-md-5">
                                                        <div class="mt10">
                                                            <span th:switch="${order.deliveryStatus}">
                                                                <span th:case="0" class="label label-danger">未发货</span>
                                                                <span th:case="1" class="label label-success">已发货</span>
                                                            </span>
                                                        </div>
                                                    </div>
                                                </div><!-- form-group -->

                                            </div><!-- row -->
                                        </div><!-- panel-body -->
                                    </div><!-- panel -->
                                </form>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-12">
                                <form action="">
                                    <div class="panel panel-default">
                                        <div class="panel-heading">
                                            <h4 class="panel-title">书籍信息</h4>
                                        </div><!-- panel-heading -->
                                        <div class="panel-body">
                                            <div class="table-responsive">
                                                <table class="table table-hover mb30">
                                                    <thead>
                                                    <tr>
                                                        <th>序号</th>
                                                        <th>图书名称</th>
                                                        <th>图书封面</th>
                                                        <th>图书价格</th>
                                                        <th>购买数量</th>
                                                    </tr>
                                                    </thead>
                                                    <tbody>
                                                    <tr th:each="item:${order.orderItems}">
                                                        <td th:text="${itemStat.index + 1}"></td>
                                                        <td th:text="${item.book.name}">Mark</td>
                                                        <td>
                                                            <img style="width: 50px;height: 50px" th:src="@{'/images/' + ${item.book.imgUrl}}" alt="">
                                                        </td>
                                                        <td th:text="${item.book.newPrice}">@mdo</td>
                                                        <td th:text="${item.count}">@mdo</td>
                                                    </tr>
                                                    </tbody>
                                                </table>
                                            </div><!-- table-responsive -->
                                        </div><!-- panel-body -->
                                    </div><!-- panel -->
                                </form>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-12">
                                <form action="">
                                    <div class="panel panel-default">
                                        <div class="panel-heading">
                                            <h4 class="panel-title">地址信息</h4>
                                        </div><!-- panel-heading -->
                                        <div class="panel-body">
                                            <div class="row">
                                                <div class="form-group">
                                                    <label class="col-md-2 mt10 control-label">收货地址</label>
                                                    <div class="col-md-10">
                                                        <div class="input-group mb15">
                                                            <span class="input-group-addon"><i class="glyphicon  glyphicon-home"></i></span>
                                                            <input type="text" class="form-control" th:value="${order.address.province} + ${order.address.city} + ${order.address.area} + ${order.address.detailAddress}" readonly />
                                                        </div>
                                                    </div>
                                                </div><!-- form-group -->


                                            </div><!-- row -->
                                        </div><!-- panel-body -->
                                    </div><!-- panel -->
                                </form>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-12">
                                <form action="">
                                    <div class="panel panel-default">
                                        <div class="panel-heading">
                                            <h4 class="panel-title">用户信息</h4>
                                        </div><!-- panel-heading -->
                                        <div class="panel-body">
                                            <div class="row">
                                                <div class="form-group">
                                                    <label class="col-md-1 mt10 control-label">用户名</label>
                                                    <div class="col-md-5">
                                                        <input type="text" th:value="${order.user.username}" name="name" class="form-control" readonly />
                                                    </div>

                                                    <label class="col-md-1 mt10 control-label">电话</label>
                                                    <div class="col-md-5">
                                                        <div class="input-group mb15">
                                                            <span class="input-group-addon"><i class="glyphicon glyphicon-earphone"></i></span>
                                                            <input type="text" class="form-control" th:value="${order.user.phone}" readonly />
                                                        </div>
                                                    </div>
                                                </div><!-- form-group -->
                                            </div><!-- row -->
                                        </div><!-- panel-body -->
                                    </div><!-- panel -->
                                </form>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-12">
                                <form action="">
                                    <div class="panel panel-default">
                                        <div class="panel-heading">
                                            <h4 class="panel-title">费用信息</h4>
                                        </div><!-- panel-heading -->
                                        <div class="panel-body">
                                            <div class="row">
                                                <div class="form-group">
                                                    <label class="col-md-2 mt10 control-label">总金额</label>
                                                    <div class="col-md-10">
                                                        <div class="input-group mb15">
                                                            <span class="input-group-addon"><i class="fa fa-jpy"></i></span>
                                                            <input type="text" class="form-control" th:value="${#numbers.formatDecimal(order.totalPrice,1,'COMMA',2,'POINT')}" readonly />
                                                        </div>
                                                    </div>
                                                </div><!-- form-group -->
                                            </div><!-- row -->
                                        </div><!-- panel-body -->
                                    </div><!-- panel -->
                                </form>
                            </div>
                        </div>

                        <div class="row text-center">
                            <button class="btn btn-primary" onclick="history.back()">返回</button>
                        </div>
                    </div><!-- contentpanel -->
                </div>
                <!--左边主题显示部分结束-->
            </div>
        </section>
        <!--页面主题部分结束-->

        <!-- 模态框开始 -->
        <div th:replace="common/adminModalAll::mainModal"></div>
        <!--模态框结束-->
    </body>

    <script th:inline="javascript">
        var contextPath = [[${#request.getContextPath()}]];
    </script>

    <script>

    </script>
</html>
